/**
 * Created by fanweihua on 2016/12/2.
 */
import React from 'react';
import PreviewHtml from './previewHtml.js';

const Preview = React.createClass({
    getInitialState: function () {
        return {
            html: PreviewHtml.html
        };
    },
    render(){
        return (
            <div className="Z_slideIn">
                <div className="page slideIn">
                    <div className="Z_content_code">
                        <div dangerouslySetInnerHTML={{__html: this.state.html}}></div>
                    </div>
                </div>
                <div className="Z_content">
                    <div className="Z_panel-body-backgound">
                        <PreviewNav></PreviewNav>
                    </div>
                </div>
            </div>
        )
    }
});
module.exports = Preview;
const PreviewNav = React.createClass({
    render(){
        return (
            <div className="Z_panel-body">
                <div className="page__hd">
                    <h1 className="page__title">Preview</h1>
                    <p className="page__desc">表单预览</p>
                </div>
                <div className="page__bd">
                    <div className="weui-form-preview">
                        <div className="weui-form-preview__hd">
                            <div className="weui-form-preview__item">
                                <label className="weui-form-preview__label">付款金额</label>
                                <em className="weui-form-preview__value">¥2400.00</em>
                            </div>
                        </div>
                        <div className="weui-form-preview__bd">
                            <div className="weui-form-preview__item">
                                <label className="weui-form-preview__label">商品</label>
                                <span className="weui-form-preview__value">电动打蛋机</span>
                            </div>
                            <div className="weui-form-preview__item">
                                <label className="weui-form-preview__label">标题标题</label>
                                <span className="weui-form-preview__value">名字名字名字</span>
                            </div>
                            <div className="weui-form-preview__item">
                                <label className="weui-form-preview__label">标题标题</label>
                                <span className="weui-form-preview__value">很长很长的名字很长很长的名字很长很长的名字很长很长的名字很长很长的名字</span>
                            </div>
                        </div>
                        <div className="weui-form-preview__ft">
                            <a className="weui-form-preview__btn weui-form-preview__btn_primary"
                               href="javascript:">操作</a>
                        </div>
                    </div>
                    <br></br>
                    <div className="weui-form-preview">
                        <div className="weui-form-preview__hd">
                            <label className="weui-form-preview__label">付款金额</label>
                            <em className="weui-form-preview__value">¥2400.00</em>
                        </div>
                        <div className="weui-form-preview__bd">
                            <div className="weui-form-preview__item">
                                <label className="weui-form-preview__label">商品</label>
                                <span className="weui-form-preview__value">电动打蛋机</span>
                            </div>
                            <div className="weui-form-preview__item">
                                <label className="weui-form-preview__label">标题标题</label>
                                <span className="weui-form-preview__value">名字名字名字</span>
                            </div>
                            <div className="weui-form-preview__item">
                                <label className="weui-form-preview__label">标题标题</label>
                                <span className="weui-form-preview__value">很长很长的名字很长很长的名字很长很长的名字很长很长的名字很长很长的名字</span>
                            </div>
                        </div>
                        <div className="weui-form-preview__ft">
                            <a className="weui-form-preview__btn weui-form-preview__btn_default"
                               href="javascript:">辅助操作</a>
                            <button type="submit" className="weui-form-preview__btn weui-form-preview__btn_primary"
                                    href="javascript:">操作
                            </button>
                        </div>
                    </div>
                </div>
            </div>
        );
    }
});